﻿/*
V1.0, Sam Hui, PDEV-1230
V1.1, Sam Hui, PDEV-1249
V1.2, Sam Wong, SH & CSI Indices in Website
V1.3, Sam Hui, PDEV-1289
V1.4, Sam Wong, PDEV-1310
V1.5, Sam Hui, PDEV-1431
V1.6, Jacky, PDEV-1513
*/

.stocks-icon-edit { margin:5px 10px 0px 0px; }
.stocks-icon-untick { margin-bottom:-4px; margin-right:4px; }
body.eng .stocks-icon-untick { margin-right:2px; }
.stocks-icon-tick { margin-bottom:-4px; margin-right:4px; }
body.eng .stocks-icon-tick { margin-right:2px; }


#SettingBar { clear:both; width:100%; height:38px; background-color:#ececec; border-top:1px solid #d3dce0; margin-top:4px; }
#SettingBar .sbText { float:left; color:#13384d; font-size:15px; font-weight:bold; line-height:38px; padding-left:20px; }
#SettingBar #spExpandHide { margin-right:5px; }
#SettingBar .sbButton { float:left; color:#4c9fc5; font-size:14px; font-weight:bold; line-height:24px; border:1px solid #cacaca; padding:0px 12px; margin-left:20px; margin-top:6px; border-radius:3px; cursor:pointer; }


#SettingPanel { background-color:#F2F2F2; padding:2px 15px 15px 15px; border-top:1px solid #d3dce0; display:none; }
#SettingPanel .spRow { overflow:hidden; clear:both; }
#SettingPanel .spRow.bordersep { border-top:1px dotted #d8d8d8; margin-top:5px; padding-top:5px; }
#SettingPanel > .spRow { padding:0px 15px; }
#SettingPanel .spLabel { font-size:15px; font-weight:bold; line-height:30px; color:#545454; }
#SettingPanel .spOptionLabel { font-size:14px; font-weight:bold; line-height:24px; color:#545454; margin-right:16px; letter-spacing:0px; }
#SettingPanel .spOptionBtn { margin-top:5px; height:14px; }
#SettingPanel .spOptionBtn > div { padding:0px 8px; color:#017aa7; margin-top:-3px; font-size:14px; font-weight:bold; height:20px; line-height:20px; border-radius:3px; letter-spacing:0px; cursor:pointer; display: inline-block; *display: inline; zoom:1; }
#SettingPanel .spOptionBtn > div:hover { color:#10abe4; }
#SettingPanel .spOptionBtn.hasIcon > div { padding-right: 0px; }
#SettingPanel .spOptionBtn.selected_pre > div { padding:0px 11px 0px 8px; }
#SettingPanel .spOptionBtn.selected_pre.hasIcon > div { padding:0px 0px 0px 8px; }
#SettingPanel .spOptionBtn.selected > div { padding:0px 9px; background-color:#cfe1e8; }
#SettingPanel .spOptionBtn.selected > div:hover { color:#017aa7; }
#SettingPanel .spOptionBtn.selected.hasIcon > div { margin-left: 8px; }
#SettingPanel .spOptionBtn.selected.hasIcon > .icon-edu { margin-left: 4px; }
#SettingPanel .spOptionBtn.selected_suf > div { padding:0px 8px 0px 11px; }
#SettingPanel .spOptionBtn.selected_suf.hasIcon > div { padding: 0px 0px 0px 8px; }
#SettingPanel .spOptionBtn.first > div { padding:0px 8px 0px 0px; }
#SettingPanel .spOptionBtn.first.hasIcon > div { padding:0px; }
#SettingPanel .spOptionBtn.selected_pre.first > div { padding:0px 11px 0px 0px; }
#SettingPanel .spOptionBtn.selected_pre.first.hasIcon > div { padding:0px; }
#SettingPanel .spOptionBtn.selected.first > div { padding:0px 9px; }
#SettingPanel .spOptionBtn.selected.first.hasIcon > div { padding:0px 9px; margin-left: 0px; }
#SettingPanel .spOptionBtn.selected.first.hasIcon > .icon-edu { margin-left: 4px; }
#SettingPanel .spOptionBtn.selected_suf.first > div { padding:0px 8px 0px 11px; }
#SettingPanel .spOptionBtn.selected_suf.first.hasIcon > div { padding:0px 0px 0px 11px; }
#SettingPanel .spOptionBtnSep { border-right:1px solid #c4c2c2; }
#SettingPanel .spOptionBtnSep.selected_pre { border-right:0px; }
#SettingPanel .spOptionBtnSep.selected { border-right:0px; }
#SettingPanel .spOptionBtnSep.sepAlways { border-right:1px solid #c4c2c2 !important; padding-right: 8px; }
#SettingPanel .spButton { margin:0px; padding:0px 20px; font-size:14px; font-weight:bold; height:30px; line-height:30px; color:#FFFFFF; background-color:#4c9fc5; cursor:pointer; }
#SettingPanel .copOption { width:225px; height:24px; }
body.eng #SettingPanel .copOption { width:200px; }
#SettingPanel .ctaOption { width:306px; height:24px; letter-spacing:0px; }
#SettingPanel .ctaOption.col1 { width:288px; }
#SettingPanel .ctaOption.col2 { width:334px; }
#SettingPanel .ctaOption.col3 { width:296px; }
#SettingPanel #cdp1 { width:430px; }
#SettingPanel #cdp2 { width:225px; }
body.eng #SettingPanel #cdp2 { width:200px; }
#SettingPanel #cdp3 { min-width:200px; }
#SettingPanel #ChartPeriodPanel { width:430px; }
#SettingPanel #ChartOtherPanel { width:450px; }
#SettingPanel #LabelChartTechAnalysis { margin-right:25px; }

 
#ChartPanel { padding:0px 15px; background-color:#e9f1f4; border-top:1px solid #d3dce0; }
#ChartPanel .cpRow { padding-top:2px; padding-bottom:2px; height:38px; overflow:hidden; clear:both; }
#ChartPanel > .cpRow { padding:0px 15px; }
#ChartPanel .cpRow.bordersep { border-top:1px dotted #d8d8d8; }
#ChartPanel .cpLabel { font-size:14px; font-weight:bold; line-height:38px; color:#545454; }
#ChartPanel .cpSubLabel { font-size:13px; font-weight:bold; line-height:38px; color:#545454; }
#ChartPanel .cpOptionLabel { font-size:13px; font-weight:bold; line-height:38px; color:#199bcd; cursor:pointer; letter-spacing:0px; }
#ChartPanel .cpOptionTextbox { position:relative; width:115px; height:28px; border:1px solid #a39d9d; }
#ChartPanel .cpOptionTextbox input { width:85px; height:28px; background-color:#e9f1f4; color:#b7b5b5; border:0px; padding-left:8px; font-size:13px; }
#ChartPanel .cpOptionTextbox input.focusing { color:#017aa7; }
#ChartPanel .cpOptionTextbox .icon_arrow { position:absolute; top:10px; right:3px; width: 0; height: 0; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 6px solid #017aa7; margin: 0 5px 0 5px; }
#ChartPanel .cpOptionSelect { font-size:13px; font-weight:bold; height:30px; line-height:30px; border:1px solid #a39d9d; background-color:#e9f1f4; color:#017aa7; }
#ChartPanel .cpOptionSep { width:1px; height:16px; margin:11px 12px 0px 12px; background-color:#a39d9d; }
body.eng #ChartPanel .cpOptionSep { margin:11px 8px 0px 8px; }
#ChartPanel .cpOptionBtn { font-size:13px; font-weight:bold; height:20px; line-height:20px; padding:0px 10px; color:#017aa7; cursor:pointer; border-radius:3px; }
#ChartPanel .cpOptionBtn:hover { color:#10abe4; }
#ChartPanel .cpOptionBtn.selected { background-color:#cfe1e8; }
#ChartPanel .cpOptionBtn.selected:hover { color:#017aa7; }
#ChartPanel .cpButton { margin-top:4px; padding:0px 15px; font-size:13px; font-weight:bold; height:30px; line-height:30px; color:#FFFFFF; background-color:#4c9fc5; cursor:pointer; }
body.eng #ChartPanel .cpButton { padding:0px 5px; }
#ChartPanel .cpAction { margin:0px 5px; }

#ChartPanel #cp1 { margin-right:8px; }
#ChartPanel #cp2 { margin-left:4px; }
body.eng #ChartPanel #cp2 { margin-left:0px; }
#ChartPanel #cp3 { margin-left:5px; }
#ChartPanel #cp4 { margin-left:5px; }
#ChartPanel #cp5 { margin-left:5px; }
#ChartPanel #cp6 { margin-right:10px; }
#ChartPanel #cp7 { margin-left:35px; margin-right:15px; }


#ChartContainer { padding:10px 10px 15px 10px; background-color:#d8e2e5; overflow:hidden; border-top:1px solid #d3dce0; }
#ChartContainer > table { width:100%; border:0px; border-collapse:collapse; }
#ChartContainer > table td { padding:0px; overflow:visible; }
#ChartContainer > table td#ChartImgContainer  { background-color:#000000; vertical-align:top; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar { clear:both; padding:3px 5px 3px 15px; border-bottom:1px solid #414141; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbTitle { float:left; color:#9c9c9c; font-size:15px; line-height:25px; font-weight:bold; margin:3px 15px 3px 0px; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbTypeSep { float:left; width:1px; height:17px; margin:7px 7px; background-color:#363636; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType { float:left; color:#49acda; font-size:15px; line-height:25px; padding:0px 5px; margin:3px 0px; font-weight:bold; cursor:pointer; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType:hover { color:#96deff; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType.selected { background-color:#317d9f; color:#FFFFFF; border-radius:5px; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType.selected:hover { color:#FFFFFF; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType .ctbTypeIcon { float:left; padding:5px 6px 5px 0px; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType .ctbTypeIcon img { width:17px; height:15px; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType .ctbTypeIcon img.selected { display:none; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType .ctbTypeIcon img.over { display:none; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType .ctbTypeIcon img.normal { display:block; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType:hover .ctbTypeIcon img.over { display:block; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType:hover .ctbTypeIcon img.normal { display:none; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType.selected .ctbTypeIcon img.selected { display:block!important; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType.selected .ctbTypeIcon img.over { display:none!important; }
#ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType.selected .ctbTypeIcon img.normal { display:none!important; }

#ChartContainer > table td#ChartImgContainer.white #ChartTypeBar { border-bottom:1px solid #d8e3e4; }
#ChartContainer > table td#ChartImgContainer.white #ChartTypeBar .ctbTitle { color:#777777; }
#ChartContainer > table td#ChartImgContainer.white #ChartTypeBar .ctbTypeSep { background-color:#e4e4e4; }
#ChartContainer > table td#ChartImgContainer.white #ChartTypeBar .ctbType { color:#4c9fc5; }
#ChartContainer > table td#ChartImgContainer.white #ChartTypeBar .ctbType:hover { color:#79c3e5; }
#ChartContainer > table td#ChartImgContainer.white #ChartTypeBar .ctbType.selected { background-color:#4c9fc5; color:#FFFFFF; }
#ChartContainer > table td#ChartImgContainer.white #ChartTypeBar .ctbType.selected:hover { color:#FFFFFF; }

#ChartContainer > table td#ChartImgContainer #ChartQuoteBar { clear:both; width:100%; padding:9px 0px 15px 0px; letter-spacing:0px; font-weight:bold; overflow:hidden; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock { float:left; margin-left:14px; color:#FFFFFF; line-height:20px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last { float:left; margin-left:30px; color:#FFFFFF; line-height:20px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last { margin-left:15px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change { float:left; margin-left:20px; color:#FFFFFF; line-height:20px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change { margin-left:15px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Update { float:right; margin-right:14px; color:#8B8B8B; line-height:20px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock .cqbTitle { font-size:15px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock .cqbValue { font-size:14px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last .cqbTitle { font-size:13px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last .cqbValue { font-size:15px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change .cqbTitle { font-size:13px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change .cqbValue { font-size:15px; }
#ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Update { font-size:12px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock .cqbTitle { font-size:14px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock .cqbValue { font-size:13px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last .cqbTitle { font-size:13px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last .cqbValue { font-size:14px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change .cqbTitle { font-size:13px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change .cqbValue { font-size:14px; }
body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Update { font-size:11px; }

#ChartContainer > table td#ChartImgContainer.white { background-color:#ffffff; }
#ChartContainer > table td#ChartImgContainer.white #ChartQuoteBar #ChartQuoteBar_Stock { color:#545454; }
#ChartContainer > table td#ChartImgContainer.white #ChartQuoteBar #ChartQuoteBar_Last { color:#545454; }
#ChartContainer > table td#ChartImgContainer.white #ChartQuoteBar #ChartQuoteBar_Change { color:#545454; }
#ChartContainer > table td#ChartImgContainer.white #ChartQuoteBar #ChartQuoteBar_Update { color:#8B8B8B; }
@media screen and (min-width: 1100px) {
    #ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbTitle { margin-right:60px; }
    #ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbType { padding:0px 10px; }
    #ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbTypeSep { margin:7px 15px; }
    #ChartContainer > table td#ChartImgContainer #ChartTypeBar .ctbTypeIcon { padding:5px 10px 5px 0px; }

    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last { margin-left:30px; }
    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change { margin-left:20px; }
    #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock .cqbTitle { font-size:16px; }
    #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock .cqbValue { font-size:15px; }
    #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last .cqbTitle { font-size:14px; }
    #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last .cqbValue { font-size:16px; }
    #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change .cqbTitle { font-size:14px; }
    #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change .cqbValue { font-size:16px; }
    #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Update { font-size:12px; }
    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock .cqbTitle { font-size:16px; }
    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Stock .cqbValue { font-size:15px; }
    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last .cqbTitle { font-size:14px; }
    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Last .cqbValue { font-size:16px; }
    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change .cqbTitle { font-size:14px; }
    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Change .cqbValue { font-size:16px; }
    body.eng #ChartContainer > table td#ChartImgContainer #ChartQuoteBar #ChartQuoteBar_Update { font-size:12px; }
}

#ChartContainer > table td#ChartImgContainer > img { width:100%; }
#ChartContainer > table td#ChartBannerContainer { vertical-align:top; }
#ChartContainer > table td#ChartQuickSetting { background-color:#F2F2F2; width:310px; vertical-align:top; }

#ChartQuickSetting .cqsTitle { background-color:#ececec; color:#13384d; border-bottom:1px solid #D5E3E4; font-size:15px; font-weight:bold; line-height:38px; padding-left:15px; }
#ChartQuickSetting .cqsTitle #cqsGoTopBtn { float:right; color:#4c9fc5; font-size:14px; font-weight:bold; line-height:24px; border:1px solid #cacaca; padding:0px 12px; margin:6px 10px 0px 0px; border-radius:3px; cursor:pointer; }
#ChartQuickSetting .cqsPanel { background-color:#F2F2F2; padding:7px 5px 20px 15px; }
#ChartQuickSetting .cqsRow { overflow:hidden; clear:both; padding-right:5px; }
#ChartQuickSetting .cqsRow .c1 {width:23%}
#ChartQuickSetting .cqsRow .c2 {width:77%}
#ChartQuickSetting .cqsRow.pt8 { padding-top:8px; }
#ChartQuickSetting .cqsRow.layerpad { padding-top:12px; padding-bottom:1px; }
#ChartQuickSetting .cqsRow.bordersep { border-bottom:1px dotted #d8d8d8; margin-bottom:7px; }
#ChartQuickSetting .cqsLabel { font-size:15px; font-weight:bold; line-height:30px; color:#545454; padding-left:5px; }
#ChartQuickSetting .cqsOptionLabel { font-size:14px; font-weight:bold; line-height:20px; color:#545454; padding-left:5px; letter-spacing:0px; }
#ChartQuickSetting .cqsLayerLabel { font-size:14px; font-weight:bold; line-height:30px; color:#545454; padding-left:5px; letter-spacing:0px; }
#ChartQuickSetting .cqsOptionBtn { margin-top:4px; margin-bottom:4px; height:14px; }
#ChartQuickSetting .cqsOptionBtn > div { padding:0px 5px; color:#017aa7; margin-top:-3px; font-size:14px; font-weight:bold; height:20px; line-height:20px; border-radius:3px; letter-spacing:0px; cursor:pointer; }
body.eng #ChartQuickSetting .cqsOptionBtn > div { font-size:13px; }
#ChartQuickSetting .cqsOptionBtn > div:hover { color:#10abe4; }
#ChartQuickSetting .cqsOptionBtn.selected_pre > div { padding:0px 7px 0px 5px; }
#ChartQuickSetting .cqsOptionBtn.selected > div { padding:0px 7px; background-color:#cfe1e8; }
#ChartQuickSetting .cqsOptionBtn.selected > div:hover { color:#017aa7; }
#ChartQuickSetting .cqsOptionBtn.selected_suf > div { padding:0px 5px 0px 7px; }
#ChartQuickSetting .cqsOptionBtnSep { border-right:1px solid #c4c2c2; }
#ChartQuickSetting .cqsOptionBtnSep.selected_pre { border-right:0px; }
#ChartQuickSetting .cqsOptionBtnSep.selected { border-right:0px; }
#ChartQuickSetting .cqsOptionSelect { font-size:14px; font-weight:bold; height:30px; line-height:30px; margin-left:5px; margin-bottom:5px; padding-left:4px; border:1px solid #cacaca; background-color:#F2F2F2; color:#017aa7; width:206px; }
#ChartQuickSetting .cqsTextbox { border-top:1px solid #cacaca; border-right:1px solid #cacaca; border-bottom:1px solid #cacaca; }
#ChartQuickSetting .cqsTextbox.firstTextbox { border-left:1px solid #cacaca; margin-left:5px; }
#ChartQuickSetting .cqsTextbox input { width:40px; height:28px; font-size:14px; line-height:28px; font-weight:bold; background-color:#F2F2F2; color:#017aa7; text-align:center; border:none; }
#ChartQuickSetting .cqsTextbox input.cqsTextboxDisable { color:#c4c2c2; }
#ChartQuickSetting .cqsButton { margin:0; padding:0; font-size:14px; font-weight:bold; height:30px; line-height:30px; color:#FFFFFF; background-color:#4c9fc5; cursor:pointer; width:100%; text-align:center; }

#ChartParaLayer { position:absolute; z-index:999; border:solid 4px #94B5C0; max-width:262px; }
#ChartParaLayer div { background:#FFF; }
#ChartParaLayer #pbTop { position:relative; overflow:hidden; }
#ChartParaLayer #pbTop .title { line-height:20px; font-weight:bold; font-size:15px; padding-right:25px; }
#ChartParaLayer table td { background:white; border:none; padding:3px; }
#ChartParaLayer div.desc { border:solid 1px #CCCCCC; height:100px; overflow-y:scroll; padding:initial; margin:initial; line-height:20px; }
#ChartParaLayer .dc-icon { background-image:url("../../resources/images/chart/dc_icon_v1.4.png") !important; }
#ChartParaLayer .btn-close { border:solid 1px #CCCCCC; width:19px; height:19px; background-position:-100px -100px; position:absolute; top:0px; right:0px; z-index:2; cursor:pointer; }
#ChartParaLayer #pbMid input { width:50px; }
#ChartParaLayer div.ind-box { height:20px; line-height:20px; width:auto; padding-right:5px; padding-top:0px; padding-bottom:0px; }
#ChartParaLayer div.ind-box-border { padding-left:5px; border:solid 1px #EAEAEA; border-radius:3px; }
#ChartParaLayer .popUpBox { position:relative; margin:0px !important; color:#000 !important; }


@media screen and (min-width: 1100px) {
    body.eng .stocks-icon-untick { margin-right:4px; }
    body.eng .stocks-icon-tick { margin-right:4px; }

    #SettingPanel .copOption { min-width:250px; }
    #SettingPanel .ctaOption { width:380px; }
    #SettingPanel .ctaOption.col1 { width:380px; }
    #SettingPanel .ctaOption.col2 { width:380px; }
    #SettingPanel .ctaOption.col3 { width:380px; }
    #SettingPanel #cdp1 { width:600px; }
    #SettingPanel #cdp2 { width:250px; }
    body.eng #SettingPanel #cdp2 { width:250px; }
    #SettingPanel #cdp3 { min-width:250px; }
    #SettingPanel #ChartPeriodPanel { width:600px; }
    #SettingPanel #ChartOtherPanel { width:500px; }

    #ChartPanel .cpLabel { font-size:15px; }
    #ChartPanel .cpSubLabel { font-size:14px; }
    #ChartPanel .cpOptionLabel { font-size:14px; }
    #ChartPanel .cpOptionTextbox { width:125px; }
    #ChartPanel .cpOptionTextbox input { font-size:14px; width:95px; }
    #ChartPanel .cpOptionSelect { font-size:14px; }
    body.eng #ChartPanel .cpOptionSep { margin:11px 12px 0px 12px; }
    #ChartPanel .cpOptionBtn { font-size:14px; }
    #ChartPanel .cpButton { padding:0px 20px; font-size:14px; }
    body.eng #ChartPanel .cpButton { padding:0px 20px; }

    #ChartPanel #cp1 { margin-right:28px; }
    #ChartPanel #cp2 { margin-left:4px; }
    body.eng #ChartPanel #cp2 { margin-left:4px; }
    #ChartPanel #cp3 { margin-left:25px; }
    #ChartPanel #cp4 { margin-left:10px; }
    #ChartPanel #cp5 { margin-left:15px; }
    #ChartPanel #cp6 { margin-right:10px; }
    #ChartPanel #cp7 { margin-left:35px; margin-right:15px; }

}

#dc-remark { color: #787878; font-size: 13px; line-height: 21px; padding: 21px 0px 22px 0px; }
@media screen and (min-width: 1200px){
    #dc-remark { font-size: 14px; }
}

@media print {
    #ChartContainer { width:960px; }
}


